let form = layui.form;
let layer = layui.layer;



// =================文章类别====================
getArticleCate()
function getArticleCate() {
  axios.get(`/my/article/cates`).then(({data:{data,message,status}})=>{
    // console.log(res);
      const htmStr=data.map(item=>{
        const{Id,name,alias}=item
        return`
              <tr>
                <td>${name}</td>
                <td>${alias}</td>
                <td>
                  <button type="button" class="layui-btn layui-btn-xs btn_edit" data-id=${Id}>编辑</button>
                  <button type="button" class="layui-btn layui-btn-xs layui-btn-danger btn_delete" data-id=${Id}>删除</button>
                </td>
              </tr>
        `
      }).join(``)
     $(`#tbody`).html(htmStr)
    })
}




let addFormStr=`
<form  id="addForm" class="layui-form">
        <!-- 第一行 分类名称 -->
        <div class="layui-form-item">
          <label class="layui-form-label">分类名称</label>
          <div class="layui-input-block">
            <input type="text" name="name" required lay-verify="required" placeholder="请输入标题" autocomplete="off"
              class="layui-input">
          </div>
        </div>
        <!-- 第二行 分类别名  -->
        <div class="layui-form-item">
          <label class="layui-form-label">分类别名</label>
          <div class="layui-input-block">
            <input type="text" name="alias" required lay-verify="required" placeholder="请输入标题" autocomplete="off"
              class="layui-input">
          </div>
        </div>
        <!-- 第三行 按钮 -->
        <div class="layui-form-item">
          <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formDemo">确认添加</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
          </div>
        </div>
      </form>

`

// ================添加=============

let indexAddForm
$(`#btnAddCate`).on(`click`,function () {
  //弹出提示框
   indexAddForm = layer.open({
    content: addFormStr,
    type: 1,
    title: `添加文章分类`,
    area: ['500px', '250px']
  });
})



//事件委托点击

$(`body`).on(`submit`,`#addForm`,function (e) {
  e.preventDefault()
  const data=$(this).serialize()
  axios.post(`/my/article/addcates`,data).then(({data:{status,message}})=>{
    // console.log(res);
    if (status!==0) {
      return layer.msg(message)
    }
    layer.msg(message)
    getArticleCate()
    layer.close(indexAddForm)
  })
})

// ================删除=============
//注册点击删除委托事件
$(`#tbody`).on(`click`,`.btn_delete`,function () {
  const Id=$(this).attr(`data-id`)
  axios.get(`/my/article/deletecate/${Id}`).then(({data:{status,message}})=>{
    // console.log(res);
    if (status!==0) {
      return layer.msg(message)
    }
    layer.msg(message)
    getArticleCate()
    
  })
})